<template>
  <view class="container">
    <view class="establishBox">
      <view class="establishBox_title">
        创建信息
      </view>
      <view class="establishBox_title_content">
        <van-cell title="选择门店" :border="false" is-link :value="shop.deptName?shop.deptName:establishObj.shopName"
          @click="navTo('/pages/shop/list')" />
        <van-cell title="二维码有效期" :border="false" value="1年" />
        <view class="Warm">
          <view class="Warm_title">
            温馨提示
          </view>
          <textarea class="Warm_content" placeholder="请填写温馨提示..." @input="WarmInput" :value="remarks"></textarea>
        </view>
      </view>
      <view class="generate" @click="clickQrcode">
        提交
      </view>
    </view>
  </view>
</template>

<script>
  import {
    mapGetters
  } from 'vuex'

  import {
    addEstablish
  } from '@/api/queue.js'

  export default {
    data() {
      return {
        // 门店id
        shopId: '',
        // 温馨提示
        remarks: '',
        shop: [],
        Qrdata: "",
        establishObj: []
      };
    },
    onLoad() {
      this.establishObj = uni.getStorageSync('Qrcode')
      uni.removeStorageSync('Qrcode');
      this.remarks = this.establishObj.remarks
      // console.log(this.establishObj)
      this.$eventHub.$on('emit', (data) => {
        this.shop = data
        // console.log(data)
      });
    },
    computed: {
      ...mapGetters('m_user', ['currentStoreId'])
    },
    methods: {
      clickQrcode() {

        var obj = {
          shopId: this.shop.id?this.shop.id:this.establishObj.shopId,
          remarks: this.remarks,
          shopName: this.shop.deptName
        }

        if (this.remarks.length == 0) {
          this.$util.Tips({
            title: '请写入温馨提示！'
          })
          return
        }
        if (this.shop.length != 0 || this.establishObj.shopName.length != 0) {
          addEstablish(obj).then(res => {
            uni.navigateTo({
              url: '/subpkg/QuickMark/QuickMark?image=' + res.data
            })
          })
        } else {
          this.$util.Tips({
            title: '您还未选择门店！'
          })
        }
      },
      navTo(url) {
        uni.navigateTo({
          url: url
        })
      },
      WarmInput(e) {
        // console.log(e)
        this.remarks = e.detail.value
      }
    }
  }
</script>

<style lang="scss">
  .establishBox {
    padding: 60rpx 24rpx;

    .establishBox_title {
      font-size: 44rpx;
      color: rgba(0, 0, 0, 0.7);
      font-weight: 600;
      margin-bottom: 50rpx;
    }

    .establishBox_title_content {
      /deep/.van-cell {
        padding: 20rpx 0;

        .van-cell__title {
          font-size: 34rpx;
          color: rgba(0, 0, 0, 0.7);
        }
      }

      .Warm {
        .Warm_title {
          font-size: 34rpx;
          color: rgba(0, 0, 0, 0.7);
          margin: 20rpx 0;
        }

        .Warm_content {
          width: 702rpx;
          height: 308rpx;
          border-radius: 10rpx;
          padding: 26rpx 38rpx;
          box-sizing: border-box;
          background-color: rgba(245, 245, 245, 1);
          font-size: 30rpx;
          color: rgba(0, 0, 0, 0.5);
        }
      }
    }

    .generate {
      width: 703rpx;
      height: 96rpx;
      margin-top: 327rpx;
      border-radius: 43rpx;
      background-color: rgba(253, 211, 56, 1);
      text-align: center;
      line-height: 96rpx;
      color: rgba(61, 61, 61, 1);
      font-size: 36rpx;
      font-weight: 600;
    }
  }
</style>
